<div>
  <div class="d-input">
    <input dTextInput style="width: 150px;"  [error]="false" placeholder='请选择工艺路线'  name="SearchTerm" [(ngModel)]="this.searchName">
    <d-button id="primaryBtn" style="margin-left: 8px" (click)="search()"><i class="icon icon-filter-o me-2" ></i>查询</d-button>
    <d-button bsStyle="common" style="margin-left: 8px" (click)="reset()"><i class="icon icon-refresh me-2"></i>重置</d-button>
  </div>
  <div class="mt-3">
    <d-data-table [lazy]="true" [dataSource]="displayTableData"
       [scrollable]="true" [fixHeader]="true" [maxHeight]="tableheight" [resizeable]="true" [tableOverflowType]="'auto'" [scrollable]="true" [resizeable]="true" [colDraggable]="true" [tableWidthConfig]="tableWidthConfig">
         <thead dTableHead >
             <tr dTableRow >
                <th dHeadCell *ngFor="let colOption of dataTableOptions.columns"><span dTooltip [content]="colOption.header">{{ colOption.header }}</span></th>
                    </tr>
                  </thead>
                  <tbody dTableBody>
                    <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex" let-nestedIndex="nestedIndex">
                      <tr dTableRow>
                        <td dTableCell >
                          <label class="custom-radio">
                            <input type="radio" name="radio-group" (change)="radio($event,rowItem)">
                            <span class="checkmark"></span>
                          </label>
                        </td>
                        <td dTableCell [rowItem]="rowItem" >
                          <span dTooltip [content]="rowItem?.technologyRouteNum">{{rowItem?.technologyRouteNum}}</span>
                        </td>
                        <td dTableCell [rowItem]="rowItem" >
                          <span dTooltip [content]="rowItem?.technologyRouteName">{{rowItem?.technologyRouteName}}</span>
                        </td>
                      </tr>
                    </ng-template>
                  </tbody>
    </d-data-table>
  </div>
  <div class="page-footer">
    <d-pagination
      [size]="'sm'"
      [canViewTotal]="true"
      [canChangePageSize]="true"
      [maxItems]="5"
      [total]="this.pager.total"
      [pageSizeOptions]="this.pageSizeOptions"
      [(pageSize)]="pager.pageSize"
      [(pageIndex)]="pager.pageIndex"
      (pageIndexChange)="pageIndexChange($event)"
      (pageSizeChange)="pageSizeChange($event)"
    >
    </d-pagination>
  </div>
</div>
